<!DOCTYPE html>
<html lang='en'>
<head>
 <title>animate-elem-30-t-manual.svg</title>
 <meta charset='utf-8'>
</head>
<body>
 <h1>Source SVG: animate-elem-30-t-manual.svg</h1>
<svg version="1.1" baseProfile="tiny" id="svg-root"
  width="100%" height="100%" viewBox="0 0 480 360"
  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <!--======================================================================-->
  <!--=  SVG 1.1 2nd Edition Test Case                                     =-->
  <!--======================================================================-->
  <!--=  Copyright 2009 World Wide Web Consortium, (Massachusetts          =-->
  <!--=  Institute of Technology, European Research Consortium for         =-->
  <!--=  Informatics and Mathematics (ERCIM), Keio University).            =-->
  <!--=  All Rights Reserved.                                              =-->
  <!--=  See http://www.w3.org/Consortium/Legal/.                          =-->
  <!--======================================================================-->
  
  <title id="test-title">$RCSfile: animate-elem-30-t.svg,v $</title>
  <defs>
    <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F">
      <font-face-src>
        <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/>
      </font-face-src>
    </font-face>
  </defs>
  <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18">
    <g transform=" translate(20 0) scale(1.3 1.3)">
      <!-- SILHOUETTES-->
      <path d="M210 40 C210 40 210 100 170 190" fill="none" stroke="#b4b4b4"/>
      <path d="M 171 188 l 10 -10 l -10 -4 z" fill="#b4b4b4" stroke="none"/>
      <polyline fill="none" stroke="#b4b4b4" stroke-width="2" points="200,20 200,40 220,40 220,60"/>
      <polyline transform="rotate(15)" fill="none" stroke="#b4b4b4" stroke-width="9" points="200,120 200,140 220,140 220,160"/>

      <line x1="40" y1="50" x2="20" y2="10" stroke="#b4b4b4" stroke-width="3"/>
      <line x1="160" y1="50" x2="80" y2="10" stroke="#b4b4b4" stroke-width="3"/>
      <line x1="30" y1="30" x2="120" y2="30" stroke="#b4b4b4"/>
      <path d="M 120 30 l -10 3 l 0 -6 z" fill="#b4b4b4" stroke="none"/>

      <line x1="70" y1="70" x2="145" y2="70" stroke="#b4b4b4"/>
      <rect x="10" y="60" width="60" height="20" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/>
      <rect x="145" y="60" width="30" height="40" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/>
      <path d="M 145 70 l -10 3 l 0 -6 z" fill="#b4b4b4" stroke="none"/>

      <circle cx="30" cy="100" r="10" fill="#b4b4b4" stroke="#b4b4b4"/>
      <circle cx="100" cy="195" r="15" fill="#b4b4b4" stroke="#b4b4b4"/>
      <line x1="37" y1="107" x2="89" y2="184" stroke="#b4b4b4"/>
      <path d="M 90 185 l -3 -12 l -6 5 z" fill="#b4b4b4" stroke="none"/>

      <rect x="300" y="10" width="20" height="20" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/>
      <rect x="300" y="170" width="20" height="40" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/>
      <line x1="310" y1="30" x2="310" y2="170" stroke="#b4b4b4"/>
      <path d="M 310 170 l -3 -10 l 6 0 z" fill="#b4b4b4" stroke="none"/>

      <rect x="230" y="7.5" width="40" height="7.5" fill="#b4b4b4" stroke="none"/>
      <rect x="230" y="170" width="40" height="30" fill="#b4b4b4" stroke="none"/>
      <line x1="250" y1="10" x2="250" y2="170" stroke="#b4b4b4"/>
      <path d="M 250 170 l -3 -10 l 6 0 z" fill="#b4b4b4" stroke="none"/>
      <!-- END OF SILHOUETTES-->

      <!-- DEFS-->
      <defs>
        <line id="lineID" x1="30" y1="50" x2="10" y2="10" stroke="rgb(16, 93, 140)" stroke-width="3">
          <animate attributeName="x1" from="30" to="90" begin="0" dur="3" fill="freeze"/>
        </line>
      </defs>

      <defs>
        <rect id="rectID" x="10" y="60" width="60" height="20" fill="blue" stroke="black" stroke-width="2">
          <animateColor attributeName="fill" from="white" to="rgb(16, 93, 140)" begin="0" dur="3" fill="freeze"/>
          <animate attributeName="height" from="20" to="40" begin="0" dur="3" fill="freeze"/>
        </rect>
      </defs>

      <defs>
        <circle id="circleID" cx="20" cy="100" r="10" fill="rgb(16, 93, 140)" stroke="black">
          <animate attributeName="cy" from="100" to="130" begin="0" dur="3" fill="freeze"/>
          <animateTransform attributeName="transform" type="scale" from="1" to="1.5" additive="sum" begin="0" dur="3" fill="freeze"/>
        </circle>
      </defs>

      <defs>
        <polyline id="polylineID" fill="none" stroke="rgb(16, 93, 140)" stroke-width="2" points="200,20 200,40 220,40 220,60">
          <animateMotion path="M 0 0 l 0 100" begin="0" dur="3" fill="freeze"/>
          <animate attributeName="stroke-width" from="2" to="9" begin="0" dur="3" fill="freeze"/>
        </polyline>
      </defs>

      <defs>
        <polygon id="polygonID" fill="green" stroke="black" points="240,20 240,40 260,40 260,20" stroke-width="2">
          <animate attributeName="fill" from="white" to="rgb(16, 93, 140)" begin="0" dur="3" fill="freeze"/>
        </polygon>
      </defs>

      <defs>
        <image id="imageID" x="230" y="20" width="40" height="80" xlink:href="">
          <animate attributeName="y" from="5" to="145" begin="0" dur="3" fill="freeze"/>
        </image>
      </defs>
      <!-- END OF DEFS-->

      <!-- ACTUAL TEST CONTENT-->
      <use xlink:href="#lineID">
        <animate attributeName="x" from="10" to="70" begin="0" dur="3" fill="freeze"/>
      </use>

      <use xlink:href="#rectID">
        <animateTransform attributeName="transform" type="translate" from="0 0" to="140 0" begin="0" dur="3" fill="freeze"/>
        <animateTransform attributeName="transform" type="scale" from="1 1" to="0.5 1" begin="0" dur="3" additive="sum" fill="freeze"/>
      </use>

      <use xlink:href="#circleID">
        <animate attributeName="x" from="10" to="70" begin="0" dur="3" fill="freeze"/>
      </use>

      <use xlink:href="#polylineID">
        <animateTransform attributeName="transform" type="rotate" from="0" to="15" additive="sum" begin="0" dur="3" fill="freeze"/>
      </use>

      <use x="60" y="-10" xlink:href="#polygonID">
        <animateMotion path="M 0 0 l 0 150" begin="0" dur="3" fill="freeze"/>
        <animateTransform attributeName="transform" type="scale" from="1 1" to="1 2" begin="0" dur="3" additive="sum" fill="freeze"/>
      </use>

      <use xlink:href="#imageID">
        <animateTransform attributeName="transform" type="scale" from="1 .25" to="1 1" begin="0" dur="3" additive="sum" fill="freeze"/>
      </use>
      <!-- END OF ACTUAL TEST CONTENT-->
    </g>
  </g>
  <g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
    <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text>
  </g>
  <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/>
  <!-- comment out this watermark once the test is approved -->
  <!--<g id="draft-watermark">
    <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/>
    <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240"
      text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text>
  </g>-->
</svg>
</body>
</html>
